// @ts-nocheck
import React, { FC, useEffect, useState } from 'react'
import style from '@/style/articles/sell.module.scss'
import axios from '@/api/request'
import { useTranslation } from 'react-i18next'
import { useNavigate } from 'react-router-dom'
const Sell: FC = () => {
  // 获取数据
  const [data, setData] = useState([])
  const { t } = useTranslation()
  const navigate = useNavigate()
  useEffect(() => {
    // eslint-disable-next-line @typescript-eslint/no-floating-promises
    axios.get('/wipi/api/article/recommend').then(res => {
      setData(res.data)
    })
  }, [])

  // 转换时间
  const times: any = (t: any) => {
    const n = new Date().getTime() - new Date(t).getTime()
    const day = n / 3600 / 1000 / 24
    return Math.floor(day)
  }

  // 监听滚动条
  const [tops, setTops] = useState(0)
  setInterval(() => {
    setTops(document.documentElement.scrollTop)
  }, 100)

  return <div className={style.sell} style={tops > 100 ? { top: '20px' } : { top: '90px' }}>
    <h4>{t('recommend')}</h4>
    {
      data.map((item: any, index) => {
        return <p onClick={() => navigate('/detail', { state: item })} key={index}>{item.title} . {times(item.createAt)}天前</p>
      })
    }
  </div>
}

export default Sell
